<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>我的车位</title>
<link rel="stylesheet" href="../../css/bootstrap.min.css">
<style type="text/css">
#myDiv {
	width: 1100px;
	margin-left: 30px;
	margin-top: 30px;
}

#addBtn {
	margin-left:60px; 
}
#btDiv{
	width:1100px;
	margin-top: 50px;
	
}
#notice{
	color: red;
}
#carPortsTable{
	width:1000px;
}
#noticeDiv{
	text-align: center;
}
td{
	text-align: center;
}
</style>
</head>
<body style="background-color: transparent;">
	<div id="btDiv">
		<a  href="addCarPort.jsp" id="addBtn" class="btn btn-default btn btn-info">增加车位</a>
		
	</div>
	<div id="myDiv">
		<table class="table table-striped table-bordered table-hover" id="carPortsTable">
			<tr>
				<td>当前编号</td>
				<td>车位所在小区</td>
				<td>车位编号</td>
				<td>车位产权证编号</td>
				<td>是否审核</td>
				<td>操作</td>
			</tr>
		</table>
		<div style="position:absolute;left:500px;top:300px;">
			<ul style="margin-left:-300px;margin-top:70px;" class="pager">
				<li><input type="hidden" id="ladyID" value="${sessionScope.myLandLady.ladyID }"></li>
				<li><input type="hidden" id="carPortID" value="0"></li>
				<li><input type="hidden" id="pageSize" value="3"></li>
				<li><a href="javascript:void(0)" id="firstPage">首页</a></li>
				<li><a href="javascript:void(0)" id="pageUp">前一页</a></li>
				<li><label id="currentPage"></label><label>/</label><label
					id="pageCount"></label></li>
				<li><a href="javascript:void(0)" id="pageDown">下一页</a></li>
				<li><a href="javascript:void(0)" id="lastPage">末页</a> 跳转至<input style="width:50px;" id="pagess" name="page" type="text" size="2"  maxlength="2" value="1" onkeyup='this.value=this.value.replace(/\D/gi,"")'>页
				</li>
				<li><a href="javascript:void(0)" id="forPage">跳转</a></li>
			</ul>
			
		</div>			
	</div>
	<div id="noticeDiv">
			<p><label id="notice"></label></p>
	</div>
	<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
	<script type="text/javascript">
		$(function() {
			init();
		});
		function init() {
			//第一次加载页面的时候默认就显示首页  每页显示三条
			findAllCarPort(1);
			
		};
		//
		function findAllCarPort(currentPage) {
			var pageSize = $("#pageSize").val();
			var id=$("#ladyID").val();
				$.ajax({
						url : "findOnePageCarPort.do",
						type : "get",
						data : {
							currentPage:currentPage,
							pageSize:pageSize,
							id:id
						},
						dataType:"json",
						success : function(result) {
							var table="";
							var type="";
							for (var i = 0; i < result.list.length; i++) {
								var index = new Number(i+1);
								if(result.list[i].type==true){
									type="已审核";
								}else{
									type="未审核";
								}
								table += "<tr><td>"+index+"</td><td>"+ result.list[i].carportAddress+ "</td><td>"
										+ result.list[i].carNO+ "</td><td>"+result.list[i].carportNO+"</td><td>"+type+"</td><td><button class='delBt btn btn-danger' id='"+result.list[i].carportID+"'>删除</button></td></tr>";
							}
							if(result.list.length==0){
								$("#currentPage").html("0");
								$("#pageCount").html("0");
							}						
							else{
								$("#currentPage").html(result.curPage);
								$("#pageCount").html(result.countPage);
							}
						    $("#carPortsTable").append(table);
						}
					});
		};
		//删除
	/* 	$("#delBtn").on("click", function() {
			var id = $("#carPortID").val();
			//这里还没有写完   需要点中的行 ID 放入隐藏字段value 
			if(id==0){
				$("#notice").html("提示：请选择行！")
			}else{
				$.ajax({
					url:"checkIspublish.do",
					type:"post",
					async:true,
					data:{"id":id},
					success:function(msg){
						if(msg!=0){
							$("#notice").html("提示：该车位已发布出租信息，不能删除！")
						}else{
							$.ajax({
								type : "POST",
								url : "delCarPort.do",
								
								data : "id=" + id,
								success : function() {
									$("#carPortsTable tr:gt(0)").remove();
									findAllCarPort(1);
								}
							});
						}
					}
				})
			
			}
		}); */
		$(".delBt").live("click",function(){
			var id = $(this).attr("id");
			$.ajax({
				url:"checkIspublish.do",
				type:"post",
				async:true,
				data:{"id":id},
				success:function(msg){
					if(msg!=0){
						$("#notice").html("提示:该车位已发布，无法删除！")
					}else{
						$.ajax({
							type : "POST",
							url : "delCarPort.do",
							
							data : "id=" + id,
							success : function() {
								$("#carPortsTable tr:gt(0)").remove();
								findAllCarPort(1);
							}
						});
					}
				}
			})
			$(this).blur(function(){
				cleanMessage();
			})
		})
	
		
		//分页的四个按钮功能  方法
		$(".pager a").click	(function(){
		var curPage=$("#currentPage").html();
		var countPage=$("#pageCount").html();
		var pageFtn=$(this).html();
		
		if(pageFtn=="首页"){
			curPage=1;
		}
		if(pageFtn=="前一页"){
			
			curPage=parseInt(curPage)-1;
			if(curPage<1){
				curPage=1;
			}
		}
		if(pageFtn=="下一页"){
			
			curPage=parseInt(curPage)+1;
			if(curPage>countPage){
				curPage=countPage;
			}
		}
		if(pageFtn=="末页"){
			
			curPage=countPage;
		}
		if(pageFtn=="跳转"){
			
			var pagger=$("#pagess").val();
			if(pagger>countPage){
				curPage=countPage;
				$("#pagess").val(countPage);
			}else if(pagger<1){
				curPage=1;
				$("#pagess").val("1");
			}else if(pagger==""){
				curPage=1;
				$("#pagess").val("1");
			}else{
				curPage=pagger;
			}
		}
		$("#carPortsTable tr:gt(0)").remove();
		$("#currentPage").html(curPage);
		
		findAllCarPort(curPage);
			
});
		function cleanMessage(){
			$("#notice").html("")
		}
		
		
	
	</script>
</body>
</html>